@extends('plugin.hostserver.front.layout.user')
@section('add_css')
    <style>
        .table td, .table th {
            padding: .75rem;
            vertical-align: top;
            border-top: 1px solid #dee2e6;
        }
    </style>
@endsection
@section('content')
    <div class="container mt-5">
        <div class="">
            <form method="post" action="{{ plugin_route('hostserver.user.buy.domain.handle',['id'=>$show['id']]) }}">
                @csrf

                <div class="col-12 tm-block-col">
                    <div class="tm-bg-primary-dark tm-block tm-block-h-auto">
                        <h2 class="tm-block-title">{{ $show['name']??'' }}</h2>
                        <div class="mt-4 mb-4">
                            <table class="table">
                                <tr>
                                    <td width="150">
                                        <div style="padding-top: 5px">操作类型</div>
                                    </td>
                                    <td>
                                        <select name="type" class="form-control" id="handleType">
                                            <option value="1" {{  empty($info)?'':$info['type']==1?'selected':'' }}>
                                                域名解析
                                            </option>
                                            <option value="2" {{  empty($info)?'':$info['type']==2?'selected':'' }}>
                                                服务器
                                            </option>
                                            <option value="3" {{  empty($info)?'':$info['type']==3?'selected':'' }}>
                                                域名转发
                                            </option>
                                            <option value="4" {{  empty($info)?'':$info['type']==4?'selected':'' }}>
                                                隐身跳转
                                            </option>
                                        </select>
                                    </td>
                                </tr>
                            </table>

                        </div>
                        <div id="handle1" class="handle" style="display: none">
                            <div id="cp-overlay-content-wrap" class="mt-3">
                                <div class="cp-overlay-row"><span
                                            style="font-size: 15px;font-weight: 600;">域名记录（必填）</span><a
                                            href="javascript:;" data-toggle="tooltip" data-placement="bottom" title=""
                                            data-original-title="对于A记录，请输入子域名和IP地址。您可以使用*作为子域名通配符。对于CNAME记录，请输入子域名和目标主机。只有在无法使用A记录时才应使用CNAME。对于转移，请输入子域名和网页（例如http://www.mysite.com/me.html）。您的子域名将转移至该网页。对于AAAA记录，请输入子域名和IP地址。"><span
                                                class="fa fa-question-circle"
                                                style="color: #0078BD;margin-left: 3px;"></span></a>
                                </div>
                                <div class="list-underline_buttom_select cp-overlay-row" style="margin-top: 8px;"></div>
                                <table class="table">
                                    <tr>
                                        <td>
                                            记录类型
                                        </td>
                                        <td>
                                            IP地址/目标主机
                                        </td>
                                        <td>操作</td>
                                    </tr>
                                    <tbody id="main_record_type">
                                    @php
                                        $main_record_data_key=0;
                                    @endphp
                                    @if(empty($content))

                                        <tr>
                                            <td>
                                                <select data-key="0" name="main_record_data[0][type]"
                                                        class="form-control js-main_record_data-type">
                                                    <option value="a" selected="selected">A</option>
                                                    <option value="cname">CNAME</option>
                                                    <option value="forward">Forward</option>
                                                    <option value="aaaa">AAAA</option>
                                                    <option value="txt">TXT</option>
                                                    <option value="mx">MX</option>
                                                </select>
                                                <input class="form-control js-value mt-1" style="display: none"
                                                       type="text" name="main_record_data[0][value]" id=""
                                                       placeholder="值">
                                            </td>
                                            <td>
                                                <input type="text" name="main_record_data[0][ip]" value="" size="40"
                                                       maxlength="2000"
                                                       placeholder="IP" class="form-control domain_form_ip"
                                                       style="">

                                            </td>
                                            <td>
                                                <a href="javascript:void(0);" class="js-del"><span
                                                            class="fa fa-trash"></span>
                                                    删除</a>
                                            </td>
                                        </tr>
                                    @else
                                        @if(!empty($content))
                                            @if(isset($content['main_record_data']) && $content['main_record_data'])

                                                @foreach($content['main_record_data'] as $k=>$v)
                                                    <tr>
                                                        <td>
                                                            <select data-key="0"
                                                                    name="main_record_data[{{ $main_record_data_key }}][type]"
                                                                    class="form-control js-main_record_data-type">
                                                                <option value="a" {{ $v['type']=='a'?'selected="selected"':'' }}>
                                                                    A
                                                                </option>
                                                                <option value="cname" {{ $v['type']=='cname'?'selected="selected"':'' }}>
                                                                    CNAME
                                                                </option>
                                                                <option value="forward" {{ $v['type']=='forward'?'selected="selected"':'' }}>
                                                                    Forward
                                                                </option>
                                                                <option value="aaaa" {{ $v['type']=='aaaa'?'selected="selected"':'' }}>
                                                                    AAAA
                                                                </option>
                                                                <option value="txt" {{ $v['type']=='txt'?'selected="selected"':'' }}>
                                                                    TXT
                                                                </option>
                                                                <option value="mx" {{ $v['type']=='mx'?'selected="selected"':'' }}>
                                                                    MX
                                                                </option>
                                                            </select>
                                                            <input class="form-control js-value mt-1"
                                                                   style="{{ $v['type']=='mx'?'':'display: none' }}"
                                                                   type="text" value="{{ $v['value'] }}"
                                                                   name="main_record_data[{{ $main_record_data_key }}][value]"
                                                                   id=""
                                                                   placeholder="值">
                                                        </td>
                                                        <td>
                                                            <input type="text"
                                                                   name="main_record_data[{{ $main_record_data_key }}][ip]"
                                                                   value="{{ $v['ip'] }}"
                                                                   size="40"
                                                                   maxlength="2000"
                                                                   placeholder="IP" class="form-control domain_form_ip"
                                                                   style="">

                                                        </td>
                                                        <td>
                                                            <a href="javascript:void(0);" class="js-del"><span
                                                                        class="fa fa-trash"></span>
                                                                删除</a>
                                                        </td>
                                                    </tr>
                                                    @php
                                                        $main_record_data_key++;
                                                    @endphp
                                                @endforeach
                                            @endif
                                        @endif
                                    @endif
                                    </tbody>
                                    <tfoot>
                                    <tr>
                                        <td colspan="2">
                                            <a href="javascript:;" class="addMore" data-to="#main_record_type"
                                               data-type="main_record_type"
                                               style="text-decoration: none;">添加记录</a>
                                        </td>
                                    </tr>
                                    </tfoot>

                                </table>

                                <div class="cp-overlay-row"><span
                                            style="font-size: 15px;font-weight: 600;">子域名记录（可选）</span><a
                                            href="javascript:;" data-toggle="tooltip" data-placement="top" title=""
                                            data-original-title="为您的域名创建子域名。例如www.mydomain.com或者blog.mydomain.com。"><span
                                                class="fa fa-question-circle"
                                                style="color: #0078BD;margin-left: 3px;"></span></a></div>
                                <div class="list-underline_buttom_select cp-overlay-row" style="margin-top: 8px;"></div>
                                <table class="table">
                                    <tr>
                                        <td>
                                            子域名
                                        </td>
                                        <td>
                                            记录类型
                                        </td>
                                        <td>
                                            IP地址/目标主机

                                        </td>
                                        <td>操作</td>
                                    </tr>
                                    <tbody id="sub_domain">

                                    @php
                                        $sub_domain_data_key=0;
                                    @endphp
                                    @if(!empty($content))
                                        @if(isset($content['subdomain']) && $content['subdomain'])

                                            @foreach($content['subdomain'] as $k=>$v)
                                                <tr>
                                                    <td><input type="text"
                                                               name="subdomain[{{ $sub_domain_data_key }}][name]"
                                                               class="form-control" placeholder=""
                                                               value="{{ $v['name'] }}"></td>
                                                    <td><select data-key="0"
                                                                name="subdomain[{{ $sub_domain_data_key }}][type]"
                                                                class="form-control js-main_record_data-type">
                                                            <option value="a" {{ $v['type']=='a'?'selected="selected"':'' }}>
                                                                A
                                                            </option>
                                                            <option value="cname" {{ $v['type']=='cname'?'selected="selected"':'' }}>
                                                                CNAME
                                                            </option>
                                                            <option value="forward" {{ $v['type']=='forward'?'selected="selected"':'' }}>
                                                                Forward
                                                            </option>
                                                            <option value="aaaa" {{ $v['type']=='aaaa'?'selected="selected"':'' }}>
                                                                AAAA
                                                            </option>
                                                            <option value="txt" {{ $v['type']=='txt'?'selected="selected"':'' }}>
                                                                TXT
                                                            </option>
                                                            <option value="mx" {{ $v['type']=='mx'?'selected="selected"':'' }}>
                                                                MX
                                                            </option>
                                                        </select>
                                                        <input class="form-control js-value mt-1"
                                                               style="{{ $v['type']=='mx'?'':'display: none' }}"
                                                               type="text"
                                                               name="subdomain[{{ $sub_domain_data_key }}][value]" id=""
                                                               placeholder="值" value="{{ $v['value'] }}"></td>
                                                    <td><input type="text"
                                                               name="subdomain[{{ $sub_domain_data_key }}][ip]"
                                                               value="{{ $v['ip'] }}" size="40"
                                                               maxlength="2000" placeholder="IP"
                                                               class="form-control domain_form_ip" style=""></td>
                                                    <td><a class="js-del" href="javascript:;"> <span
                                                                    class="fa fa-trash js-del"></span> 删除 </a></td>
                                                </tr>
                                                @php
                                                    $sub_domain_data_key++;
                                                @endphp
                                            @endforeach
                                        @endif
                                    @endif

                                    </tbody>
                                    <tfoot>
                                    <tr>
                                        <td colspan="3">
                                            <a href="javascript:;" class="addMore" data-to="#sub_domain"
                                               data-type="sub_domain"
                                               style="text-decoration: none;">添加记录</a>
                                            <p>
                                            <p>
                                                <a class="btn btn-primary btn-sm" data-toggle="collapse"
                                                   href="#collapseExample" role="button" aria-expanded="false"
                                                   aria-controls="collapseExample">
                                                    <i class="fa fa-question"></i> 查看帮助
                                                </a>

                                            </p>

                                        </td>

                                    </tr>

                                    </tfoot>

                                </table>
                                <div class="collapse" id="collapseExample">
                                    <div class="card card-body">
                                        <div class="alert alert-warning ">
                                            <h3 style="font-size: 14px">提示：</h3>
                                            <p>
                                                <code>www</code> 解析后的域名为 www.{{ $show['name'] }}
                                            </p>

                                            <p><code>*</code> 解析后的域名为 *.{{ $show['name'] }}</p>

                                        </div>
                                        <div class="alert alert-warning ">
                                            <h3 style="font-size: 14px">提示：</h3>
                                            <p>
                                                <code>A</code> 用来指定域名的IPv4地址（如：8.8.8.8），如果需要将域名指向一个IP地址，就需要添加A记录。
                                            </p>
                                            <p><code>CNAME</code> 如果需要将域名指向另一个域名，再由另一个域名提供ip地址，就需要添加CNAME记录。</p>
                                            <p><code>MX</code> 如果需要设置邮箱，让邮箱能收到邮件，就需要添加MX记录。</p>
                                            <p><code>TXT</code> 在这里可以填写任何东西，长度限制255。绝大多数的TXT记录是用来做SPF记录（反垃圾邮件）。</p>
                                            <p><code>NX</code> 域名服务器记录，如果需要把子域名交给其他DNS服务商解析，就需要添加NS记录。</p>
                                            <p><code>AAAA</code> 用来指定主机名（或域名）对应的IPv6地址（例如：ff06:0:0:0:0:0:0:c3）记录。</p>

                                        </div>
                                    </div>
                                </div>

                                <div style="margin-top: 25px;"><span
                                            style="font-size: 15px;font-weight: 600;">生效时间（可选）</span><a
                                            href="javascript:;"
                                            data-toggle="tooltip"
                                            data-placement="top"
                                            title=""
                                            data-original-title="为您域名的所有DNSd记录指定TTL。如未指定，TTL将为3小时。"><span
                                                class="fa fa-question-circle"
                                                style="color: #0078BD;margin-left: 3px;"></span></a></div>
                                <div class="list-underline_buttom_select cp-overlay-row" style="margin-top: 8px;"></div>

                                <select name="glue_dns_ttl" size="1" class="form-control" id="selectTime"
                                        style="background: #fff;" tabindex="-1">

                                    <option value="300" {{ empty($content)?'selected':$content['glue_dns_ttl']==300?'selected':'' }}>5 分钟</option>
                                    <option value="600" {{ empty($content)?'selected':$content['glue_dns_ttl']==600?'selected':'' }}>10 分钟</option>
                                    <option value="1800" {{ empty($content)?'selected':$content['glue_dns_ttl']==1800?'selected':'' }}>30 分钟</option>
                                    <option value="3600" {{ empty($content)?'selected':$content['glue_dns_ttl']==3600?'selected':'' }}>1 小时</option>
                                    <option value="7200" {{ empty($content)?'selected':$content['glue_dns_ttl']==7200?'selected':'' }}>2 小时</option>
                                    <option value="14400" {{ empty($content)?'selected':$content['glue_dns_ttl']==14400?'selected':'' }}>4 小时</option>
                                    <option value="28800" {{ empty($content)?'selected':$content['glue_dns_ttl']==28800?'selected':'' }}>8 小时</option>
                                    <option value="86400" {{ empty($content)?'selected':$content['glue_dns_ttl']==86400?'selected':'' }}>1 天</option>
                                    <option value="172800" {{ empty($content)?'selected':$content['glue_dns_ttl']==172800?'selected':'' }}>2 天</option>
                                    <option value="345600" {{ empty($content)?'selected':$content['glue_dns_ttl']==345600?'selected':'' }}>4 天</option>
                                    <option value="604800" {{ empty($content)?'selected':$content['glue_dns_ttl']==604800?'selected':'' }}>1 周</option>
                                    <option value="1209600" {{ empty($content)?'selected':$content['glue_dns_ttl']==1209600?'selected':'' }}>2 周</option>
                                </select>
                            </div>
                        </div>

                        <div id="handle2" style="display: none" class="handle">
                            <table class="table">
                                <tr>
                                    <td>
                                        序号
                                    </td>
                                    <td>
                                        地址
                                    </td>
                                    <td>操作</td>
                                </tr>
                                <tr>
                                    <td colspan="2">输入新的或现有域名服务器 (ns1.myhost.com, ns2.myhost.com)</td>
                                </tr>
                                <tbody id="dnsBody">
                                @php
                                    $main_dns_data_key=0;
                                @endphp

                                @if(!empty($content))
                                    @if(isset($content['dns']) && $content['dns'])

                                        @foreach($content['dns'] as $k=>$v)
                                            <tr>
                                                <td>
                                                    DNS{{ $main_dns_data_key+1 }}
                                                </td>

                                                <td>
                                                    <input type="text" name="dns[{{ $main_dns_data_key }}]" value="{{ $v }}"
                                                           size="40" maxlength="2000"
                                                           placeholder="域名服务" class="form-control domain_form_ip"
                                                           style="">
                                                </td>
                                                <td>
                                                    <a href="javascript:void(0);" class="js-del"><span
                                                                class="fa fa-trash"></span>
                                                        删除</a>
                                                </td>
                                            </tr>
                                            @php
                                                $main_dns_data_key++;
                                            @endphp
                                        @endforeach
                                    @else
                                        <tr>
                                            <td>
                                                DNS1
                                            </td>

                                            <td>
                                                <input type="text" name="dns[0]" value="" size="40" maxlength="2000"
                                                       placeholder="域名服务" class="form-control domain_form_ip"
                                                       style="">
                                            </td>
                                            <td>
                                                <a href="javascript:void(0);" class="js-del"><span
                                                            class="fa fa-trash"></span>
                                                    删除</a>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                DNS2
                                            </td>

                                            <td>
                                                <input type="text" name="dns[1]" value="" size="40" maxlength="2000"
                                                       placeholder="域名服务" class="form-control domain_form_ip"
                                                       style="">
                                            </td>
                                            <td>
                                                <a href="javascript:void(0);" class="js-del"><span
                                                            class="fa fa-trash"></span>
                                                    删除</a>
                                            </td>
                                        </tr>
                                    @endif
                                @endif


                                </tbody>
                                <tfoot>
                                <tr>
                                    <td colspan="3">
                                        <a href="javascript:;" class="addMore" data-to="#dnsBody" data-type="dns"
                                           style="text-decoration: none;">添加服务器</a>
                                    </td>
                                </tr>
                                </tfoot>

                            </table>
                        </div>
                        <div id="handle3" style="display: none" class="handle">
                            <table class="table">

                                <tbody>
                                <tr id="firt_domain">

                                    <td>
                                        <label style="padding: 5px 0">
                                            跳转地址
                                        </label>
                                        <input type="text" name="forward_url"
                                               value="{{ empty($content)?'':$content['forward_url'] }}" size="40"
                                               maxlength="2000"
                                               placeholder="跳转地址" class="form-control domain_form_ip"
                                               id="glue_dns_domain_id_0" style="">
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <label style="padding: 5px 0">
                                            跳转类型
                                        </label>
                                        <select name="forward_type" class="form-control" id="selectRecordType0"
                                                style="padding: 0">
                                            <option value="301" {{ empty($content)?'':$content['forward_type']==301?'selected':'' }}>
                                                301重定向——永久转移
                                            </option>
                                            <option value="302" {{ empty($content)?'selected':$content['forward_type']==302?'selected':'' }}>
                                                302重定向——临时转移
                                            </option>

                                        </select>
                                    </td>
                                </tr>
                                </tbody>


                            </table>
                        </div>
                        <div id="handle4" style="display: none" class="handle">
                            <table class="table">

                                <tbody>

                                <tr>

                                    <td>
                                        <label style="padding: 5px 0">
                                            跳转到网页
                                        </label>
                                        <input type="text" name="stealth_url"
                                               value="{{ empty($content)?'':$content['stealth_url'] }}" size="40"
                                               maxlength="2000"
                                               placeholder="跳转到网页" class="form-control domain_form_ip"
                                               style="">
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <label style="padding: 5px 0">
                                            网站标题
                                        </label>
                                        <input type="text" name="stealth_title"
                                               value="{{ empty($content)?'':$content['stealth_title'] }}" size="40"
                                               maxlength="2000"
                                               placeholder="网站标题" class="form-control domain_form_ip"
                                               style="">
                                        <p>
                                            隐式转发使用可能会对搜索引擎排名造成干扰的框架。您在上方输入的标题将被插入至框架集以为您的排名提供帮助。同时，无论您位于任何页面，显示在浏览器地址栏的url均不会更改；例如，它将总是显示http://www.mysite.com。
                                        </p>
                                    </td>
                                </tr>
                                </tbody>
                                <tfoot>

                                </tfoot>

                            </table>
                        </div>

                        <div style="margin: 30px 0">
                            <a href="javascript:window.go(-1)" class="btn btn-info ">取消</a>
                            <a class="btn btn-primary ajax-submit" style="color: #fff">保存提交</a>
                        </div>
                    </div>

                </div>
            </form>
        </div>
    </div>
    <div class="clearfix"></div>
@endsection
@section('foot_js')
    <script>
        $(function () {
            $('[ data-toggle="tooltip" ]').tooltip();
            $("#handleType").change(function () {
                var type = $(this).val();
                $(".handle").hide();
                $("#handle" + type).show();
            })
            //最加
            $(".addMore").click(function () {
                var to = $(this).data('to');
                var type = $(this).data('type');
                return typeHtml(to, type);
            })
            //删除
            $(document).on("click", ".js-del", function () {
                var type = $(this).data('type');
                var to = $(this).data('to');
                var p = $(this).parents('tr');
                p.remove();
            })
            //监听
            $(document).on('change', '.js-main_record_data-type', function () {
                var value = $(this).val();
                if (value == 'mx') {
                    $(this).parent('td').find('.js-value').show()
                } else {
                    $(this).parent('td').find('.js-value').hide()
                }
            })
            //设置什么显示
            $type = "{{ empty($info)?1:$info['type'] }}";
            $(".handle").hide();
            $("#handle" + $type).show();
        })
        main_record_data_page = "{{ $main_record_data_key+1 }}";
        main_sub_data_page = "{{ $sub_domain_data_key+1 }}";
        main_dns_data_page = "{{ $main_dns_data_key+2 }}";

        function typeHtml(to, type) {
            switch (type) {
                case "main_record_type":

                    html = ' <tr > <td> <select name="main_record_data[' + main_record_data_page + '][type]" ' +
                        'class="form-control js-main_record_data-type"> ' +
                        '<option value="a" selected="selected">A</option> <option value="cname">CNAME</option>' +
                        ' <option value="forward">Forward</option> <option value="aaaa">AAAA</option> ' +
                        '<option value="txt">TXT</option> <option value="mx">MX</option> </select><input class="form-control js-value mt-1"' +
                        ' style="display: none" type="text" name="main_record_data[' + main_record_data_page + '][value]" id="" placeholder="值"> </td> <td> ' +
                        '<input type="text" name="main_record_data[' + main_record_data_page + '][ip]" value="" size="40" maxlength="2000" placeholder="IP"' +
                        ' class="form-control domain_form_ip"style=""> </td>' +
                        ' <td> <a href="javascript:;" class="js-del" data-type="' + type + '" data-id="' + to + '"><span class="fa fa-trash"></span> 删除 </td></a> </tr>';
                    main_record_data_page++;

                    break;
                case "sub_domain":

                    html = '<tr> <td> <input type="text" name="subdomain[' + main_sub_data_page + '][name]" class="form-control"' +
                        ' placeholder=""> </td> <td> ' +
                        '<select name="subdomain[' + main_sub_data_page + '][type]" class="form-control js-main_record_data-type" ' +
                        ' style="padding: 0"> <option value="0">请选择类型</option> ' +
                        '<option value="a" selected="selected">A</option> ' +
                        '<option value="cname">CNAME</option> <option value="forward">Forward</option> ' +
                        '<option value="aaaa">AAAA</option> <option value="txt">TXT</option>' +
                        ' <option value="mx">MX</option> </select> ' +
                        '<input class="form-control js-value mt-1" style="display: none" type="text"' +
                        ' name="subdomain[' + main_sub_data_page + '][value]" id="" placeholder="值"></td> <td> ' +
                        '<input type="text" name="subdomain[' + main_sub_data_page + '][ip]" value="" size="40" ' +
                        'maxlength="2000" placeholder="IP" class="form-control domain_form_ip" ' +
                        'style=""> </td> <td> <a class="js-del" href="javascript:;"> ' +
                        '<span class="fa fa-trash js-del"></span> 删除 ' +
                        '</a> </td> </tr>';
                    main_sub_data_page++;

                    break;
                case "dns":
                    html = '<tr> <td> DNS' + main_dns_data_page + ' </td> <td> ' +
                        '<input type="text" name="dns[' + main_dns_data_page + ']"  value=""' +
                        ' size="40" maxlength="2000" placeholder="域名服务"' +
                        ' class="form-control domain_form_ip" ' +
                        ' style=""> </td> ' +
                        '<td> ' +
                        ' <a href="javascript:void(0);" class="js-del">' +
                        '<span class="fa fa-trash"></span> 删除</a> </td> </tr>';
                    break
            }
            $(to).append(html);
        }
    </script>
@endsection